<template>
    <el-dialog
    :title="!dataForm.id? '新增' : '修改'"
    :close-on-click-modal="false"
    :visible.sync="visible">
    <el-form :model="dataForm" :rules="dataRule" ref="dataForm" label-width="100px">
      <el-form-item label="用户id" prop="memberId">
        <el-input v-model="dataForm.memberId" placeholder="用户id"></el-input>
      </el-form-item>
      <el-form-item label="所属公司id" prop="companyId">
        <el-input v-model="dataForm.companyId" placeholder="所属公司id"></el-input>
      </el-form-item>
      <el-form-item label="会员卡号" prop="cardNo">
        <el-input v-model="dataForm.cardNo" placeholder="会员卡号"></el-input>
      </el-form-item>
      <el-form-item label="用户姓名" prop="memberName">
        <el-input v-model="dataForm.memberName" placeholder="用户姓名"></el-input>
      </el-form-item>
      <el-form-item label="用户电话" prop="memberMobile">
        <el-input v-model="dataForm.memberMobile" placeholder="用户电话"></el-input>
      </el-form-item>
      <el-form-item label="会员卡类型" prop="cardType">
        <el-input v-model="dataForm.cardType" placeholder="会员卡类型"></el-input>
      </el-form-item>
      <el-form-item label="变更类型：1-后台调整,2-消费" prop="changeType">
        <el-input v-model="dataForm.changeType" placeholder="变更类型：1-后台调整,2-消费"></el-input>
      </el-form-item>
      <el-form-item label="变更费用" prop="changeFee">
        <el-input v-model="dataForm.changeFee" placeholder="变更费用"></el-input>
      </el-form-item>
      <el-form-item label="余额变更" prop="balanceChange">
        <el-input v-model="dataForm.balanceChange" placeholder="余额变更"></el-input>
      </el-form-item>
      <el-form-item label="次数变更(若卡类型为次卡:0表示从有限次变更为不限次)" prop="timesChange">
        <el-input v-model="dataForm.timesChange" placeholder="次数变更(若卡类型为次卡:0表示从有限次变更为不限次)"></el-input>
      </el-form-item>
      <el-form-item label="积分变更" prop="pointsChange">
        <el-input v-model="dataForm.pointsChange" placeholder="积分变更"></el-input>
      </el-form-item>
      <el-form-item label="有效期变更：原有效期-现有效期" prop="expireTimeChange">
        <el-input v-model="dataForm.expireTimeChange" placeholder="有效期变更：原有效期-现有效期"></el-input>
      </el-form-item>
      <el-form-item label="变更说明" prop="changeDesc">
        <el-input v-model="dataForm.changeDesc" placeholder="变更说明"></el-input>
      </el-form-item>
      <el-form-item label="变更时间" prop="createTime">
        <el-input v-model="dataForm.createTime" placeholder="变更时间"></el-input>
      </el-form-item>
      <el-form-item label="操作员" prop="operator">
        <el-input v-model="dataForm.operator" placeholder="操作员"></el-input>
      </el-form-item>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button @click="visible = false">取消</el-button>
      <el-button type="primary" :disabled="disabled" @click="dataFormSubmit()">确定</el-button>
    </span>
  </el-dialog>
</template>

<script>
  export default {
    data () {
      return {
        visible: false,
        disabled: false,
        dataForm: {
          id: null,
          memberId: null,
          companyId: null,
          cardNo: null,
          memberName: null,
          memberMobile: null,
          cardType: null,
          changeType: null,
          changeFee: null,
          balanceChange: null,
          timesChange: null,
          pointsChange: null,
          expireTimeChange: null,
          changeDesc: null,
          createTime: null,
          operator: null
        },
        dataRule: {
          memberId: [
            {required: true, message: '用户id不能为空', trigger: 'blur'}
          ],
          companyId: [
            {required: true, message: '所属公司id不能为空', trigger: 'blur'}
          ],
          cardNo: [
            {required: true, message: '会员卡号不能为空', trigger: 'blur'}
          ],
          memberName: [
            {required: true, message: '用户姓名不能为空', trigger: 'blur'}
          ],
          memberMobile: [
            {required: true, message: '用户电话不能为空', trigger: 'blur'}
          ],
          cardType: [
            {required: true, message: '会员卡类型不能为空', trigger: 'blur'}
          ],
          changeType: [
            {required: true, message: '变更类型：1-后台调整,2-消费不能为空', trigger: 'blur'}
          ],
          changeFee: [
            {required: true, message: '变更费用不能为空', trigger: 'blur'}
          ],
          balanceChange: [
            {required: true, message: '余额变更不能为空', trigger: 'blur'}
          ],
          timesChange: [
            {required: true, message: '次数变更(若卡类型为次卡:0表示从有限次变更为不限次)不能为空', trigger: 'blur'}
          ],
          pointsChange: [
            {required: true, message: '积分变更不能为空', trigger: 'blur'}
          ],
          expireTimeChange: [
            {required: true, message: '有效期变更：原有效期-现有效期不能为空', trigger: 'blur'}
          ],
          changeDesc: [
            {required: true, message: '变更说明不能为空', trigger: 'blur'}
          ],
          createTime: [
            {required: true, message: '变更时间不能为空', trigger: 'blur'}
          ],
          operator: [
            {required: true, message: '操作员不能为空', trigger: 'blur'}
          ]
        }
      }
    },
    methods: {
      init (id) {
        this.dataForm.id = id || null;
        this.visible = true
        this.$nextTick(() => {
          this.$refs['dataForm'].resetFields();
          if (this.dataForm.id) {
            this.$http({
              url: this.$http.adornUrl(`/member/vipCardRecord/detail/${this.dataForm.id}`),
              method: 'get',
              params: this.$http.adornParams()
            }).then(({data}) => {
              if (data && data.code === 0) {
                this.dataForm.memberId = data.item.memberId;
                this.dataForm.companyId = data.item.companyId;
                this.dataForm.cardNo = data.item.cardNo;
                this.dataForm.memberName = data.item.memberName;
                this.dataForm.memberMobile = data.item.memberMobile;
                this.dataForm.cardType = data.item.cardType;
                this.dataForm.changeType = data.item.changeType;
                this.dataForm.changeFee = data.item.changeFee;
                this.dataForm.balanceChange = data.item.balanceChange;
                this.dataForm.timesChange = data.item.timesChange;
                this.dataForm.pointsChange = data.item.pointsChange;
                this.dataForm.expireTimeChange = data.item.expireTimeChange;
                this.dataForm.changeDesc = data.item.changeDesc;
                this.dataForm.createTime = data.item.createTime;
                this.dataForm.operator = data.item.operator;
              }
            })
          }
        })
      },
      // 表单提交
      dataFormSubmit () {
        this.$refs['dataForm'].validate((valid) => {
          if (valid) {
            this.disabled = true;
            this.$http({
                url: this.$http.adornUrl(`/member/vipCardRecord/${!this.dataForm.id ? 'save' : 'update'}`),
                method: 'post',
                data: this.$http.adornData({
                  id: this.dataForm.id || undefined,
                  memberId: this.dataForm.memberId,
                  companyId: this.dataForm.companyId,
                  cardNo: this.dataForm.cardNo,
                  memberName: this.dataForm.memberName,
                  memberMobile: this.dataForm.memberMobile,
                  cardType: this.dataForm.cardType,
                  changeType: this.dataForm.changeType,
                  changeFee: this.dataForm.changeFee,
                  balanceChange: this.dataForm.balanceChange,
                  timesChange: this.dataForm.timesChange,
                  pointsChange: this.dataForm.pointsChange,
                  expireTimeChange: this.dataForm.expireTimeChange,
                  changeDesc: this.dataForm.changeDesc,
                  createTime: this.dataForm.createTime,
                  operator: this.dataForm.operator
                })
            }).then(({data}) => {
              this.disabled = false;
              if (data && data.code === 0) {
                this.$message({
                  message: '操作成功',
                  type: 'success',
                  duration: 1500,
                  onClose: () => {
                    this.visible = false;
                    this.$emit('refreshDataList');
                  }
                })
              } else {
                this.$message.error(data.msg);
              }
            })
          }
        })
      }
    }
  }
</script>
